<template lang="html">
  <div class="tixian" id="">
    <h2 v-title="'提现'"></h2>
    <router-link :to="{ name: 'bankCards', params: { }}">
    <div class="chooseBank">
      <img src="@/assets/images/longlive@2x.png" alt="" width="34">
      <div class="" v-if="isBank">
        <span>{{bankcard.bankName}}</span>
        <p>尾号{{bankcard.cardNo.slice(-4)}}</p>
      </div>
      <div class="" v-else style="color:#999;">
        请选择提现银行
      </div>
      <img src="@/assets/images/right-icon@2x.png" alt="" width="10">
    </div>
    </router-link>
    <div class="tixianMoney">
      <p>提现金额（收取{{withdrawalRate}}%手续费）</p>
      &yen;<input type="number" name="" v-model="withdrawFee">
      <em>可提现金额{{walletMoney}}</em>
      <br>
      <button type="button" name="button" class="blockBtn" @click="applyWithdraw">立即提现</button>
    </div>


  </div>
</template>

<script>
import {mapState} from 'Vuex';
import { Toast,MessageBox  } from 'mint-ui';
export default {
  name:'tixian',
  data:() =>({
    withdrawFee:0,      //提现金额
    isLandlord:false,     //默认不是房东
    // bankcard:'',        //银行
    // isBank:false,
    walletMoney:0,        //可提现金额
    withdrawalRate:0,     //提现手续费
  }),
  computed: {
    ...mapState({
      isBank:state=>state.member.isBank,
      bankcard:state=>state.member.bankcard,
    })
  },
  methods: {
    applyWithdraw() {
      let that = this;
      let isLandlord = that.isLandlord;
      let tixianUrl = '';
      if (!isLandlord) {    //不是房东
        tixianUrl = configUrl.APPLYUSERWITHDRAW_URL;
      }else{
        tixianUrl = configUrl.APPLYLANDLORDWITHDRAW_URL;
      }
      let withdrawFee = that.withdrawFee;   //提现金额
      let walletMoney = that.walletMoney;   //可提现金额
      if (parseFloat(withdrawFee)>parseFloat(walletMoney)) {
        Toast('您当前可提现金额不足');
        return false;
      }
      if (withdrawFee<10) {
        Toast('提现金额需10元起');
        return false;
      }
      let isBank = that.isBank;

      if (!isBank) {    //未选择银行
        Toast('请选择提现银行');
        return false;
      }else{

      }
      let tixianParam = {
        withdrawFee:withdrawFee,
        bankName:that.bankcard.bankName,
        cardTruename:that.bankcard.cardTruename,
        cardNo:that.bankcard.cardNo
      }
      network.get(tixianUrl,tixianParam,function (res) {
        console.log(res);
        MessageBox.alert('提现申请成功，请耐心等待后台审核').then(action=>{
          that.$router.go(-1);
        })
      },function (err) {
        console.log(err);
      })
    },

  },
  mounted() {
    let that = this;
    let isLandlord =  that.$route.query.isLandlord
    that.isLandlord = isLandlord;
    let walletUrl = '';
    if (isLandlord==true||isLandlord=='true') {   //true房东
      walletUrl = configUrl.LANDLORDWALLET_URL;
    }else {
      walletUrl = configUrl.USERWALLET_URL;
    }
    network.get(walletUrl,'',function(res){
      console.log(res);
      let frozenBalance = res.data.frozenBalance;   //冻结金额
      let userBalance = res.data.userBalance;       //余额
      let withDrawBalance = res.data.withDrawBalance;   //可提现金额
      that.withdrawalRate = parseFloat(res.data.withdrawalRate)/10*1000;     //提现手续费

      if (isLandlord==true||isLandlord=='true') {   //true房东
        that.walletMoney = (withDrawBalance/100).toFixed(2);   //可提现金额=余额-冻结资金
      }else {
        that.walletMoney = (parseFloat(userBalance)/100).toFixed(2);   //可提现金额
      }
    },function (err) {
      console.log(err);
    });
    that.$nextTick(()=>{
      // eventBus.$on('bankEvent', function(val) {
      // 　console.log(val);
      //   that.isBank = true;
      //   that.bankcard = val;
      //   console.log(that.isBank);
      // });
    })

  }
}
</script>

<style lang="scss" scoped>
@import "@/main.scss";
.tixian{
  background: $eeeColor;
  font-size: 1rem;
}
.chooseBank{
  @include flex;
  margin-bottom: 10px;
  background: white;
  padding: 10px 20px;
  div{
    @include flexcell;
    margin-left: 20px;
    span{
      font-size: 1.1rem;
    }
    p{
      color: $grayColor;
    }
  }
}
.tixianMoney{
  background: white;
  padding: 20px;
  font-size: 1.3rem;
  margin-bottom: 20px;
  p{
    font-size: 1rem;
  }
  input{
    font-size: 1.3rem;
    margin:10px auto;
    margin-left: 10px;
    border: none;
    border-bottom: 1px solid $borderColor;
  }
  em{
    display: block;
    color: $grayColor;
    font-size: 0.9rem;
    margin-left: 20px;
  }
}
</style>
